<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>加入我们</title>
		<link rel="stylesheet" href="css/jionbody.css" />
	</head>

	<body align="center">

		<header>
			<div class="head_box">
				<img class="logo" src="img/logo.png" />
				<img src="img/title-nav.png" class="title-nav" />
				<div class="none-line"></div>
				<nav>
					<ul>
						<li>
							<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-about">关于疯咖</a>
						</li>
						<li>
							<a href="###">扫码关注</a>
							<img class="dcode_nav" src="img/dcode.png"/>
						</li>
						<li><a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-order">点单流程</a></li>
						<li><a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-product">产品</a></li>
						<li><a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-activities">活动</a></li>
						<li>
							<a class="join" href="###">加入</a>
							<div class="none-join">
								<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/join.html">加盟合作</a>
								<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/%E7%96%AF%E5%92%96-%E5%8A%A0%E5%85%A5%E6%88%91%E4%BB%AC.html">加入我们</a>
							</div>
						</li>
						<li><a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-contact">联系</a></li>
					</ul>
				</nav>
				<div class="none_nav" style="text-align: left">
					<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-about">关于疯咖</a>
					<a href="###">扫码关注</a>
					<img class="dcode_none_nav" src="img/dcode.png" />
					<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-order">点单流程</a>
					<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-product">产品</a>
					<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-activities">活动</a>
					<a href="###">加入</a>
					<a href="http://127.0.0.1:8020/%E7%96%AF%E5%92%96/foamka_coffee.html#anchor-contact">联系</a>
				</div>
			</div>
		</header>

		<img src="img/joinbody.jpg" class="jionbody" />
		<div class="jion-content">
			<div class="changeLittle">
				<p class="joinus-p">&nbsp;&nbsp;JOIN&nbsp;US</p>
				<p class="joinus-p">与我们一起用科技的力量改变生活一点点</p>
			</div>
			<div class="changeLittle">
				<div class="">
					<span class="logistics">后勤支持类</span>
					<span class="place">（工作地点：北京）</span>
				</div>
				<ul>
					<li>1.ioS工程师</li>
					<li>2.产品经理</li>
					<li>3.设计主管</li>
				</ul>
				<ul>
					<li>4.UI/平面设计师</li>
					<li>5.市场推广</li>
					<li>6.客服专员</li>
				</ul>
			</div>
			<div class="changeLittle">
				<span class="logistics">运营服务类</span>
				<span class="place">（工作地点:上海、北京、广州、深圳、杭州、天津）</span>
				<p class="recruit">1.全职/兼职咖啡师</p>
			</div>
			<p class="join-footer">以上职位敬请统一投递简历至：</p>
			<p class="join-footer">hr@fomaka.me(邮件请勿包含附件，简历请复制至邮件正文)</p>
			<p class="join-footer">虚位以待!期待有梦想的你加入我们！</p>
		</div>
		<footer>
			<img src="img/footer-fengka.png" />
		</footer>
		<p class="footer-message">©2015 foamka crew. All rights reserved. 沪icp备********号</p>
	</body>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
		(function($) {
			$("header .head_box nav .dcode_nav").on("mouseover", function() {
				$("header .head_box nav .dcode_nav").show(0);
			});
			$("header .head_box nav .dcode_nav").on("mouseout", function() {
				$("header .head_box nav .dcode_nav").hide(0);
			});

			$("header .head_box nav a").eq(1).hover(function() {
				$("header .head_box nav .dcode_nav").css("display", "block");
			}, function() {
				$("header .head_box nav .dcode_nav").css("display", "none");
			});
			$("header .head_box .none_nav a").eq(1).hover(function() {
				$("header .head_box .none_nav .dcode_none_nav").css("display", "block");
			}, function() {
				$("header .head_box .none_nav .dcode_none_nav").css("display", "none");
			});
			$("header .head_box nav ul li").eq(5).on("mouseover", function() {
				$("header .head_box nav .none-join").css("display", "block");
			});
			$("header .head_box nav .none-join").on("mouseout", function() {
				$("header .head_box nav .none-join").hide(0);
			});

			$("header .head_box nav .none-join a").each(function() {
				$(this).hover(function() {
					$(this).css("color", "#FFF");
				}, function() {
					$(this).css("color", "#000");
				});
			});

			var loack = true;
			$("header .head_box .title-nav").on("click", function() {
				if(loack == true) {
					$("header .head_box .none_nav").css("display", "block");
					$("header .head_box .none-line").css("display", "block");
					$("header .head_box").css("height", "11rem");
					loack = false;
					console.log(1);
				} else {
					$("header .head_box .none_nav").css("display", "none");
					$("header .head_box .none-line").css("display", "none");
					$("header .head_box").css("height", "1.8rem");
					loack = true;
				}
			});

			function aaa() {
				if($("body").width() > 830) {
					$("header .head_box .none_nav").css("display", "none");
					$("header .head_box .none-line").css("display", "none");
					$("header .head_box").css("height", "1.8rem");
				}
			}
			setInterval(function() {
				aaa();
			}, 500);

			$(function() {
				$("header .head_box nav a,header .head_box .none_nav a").click(function() {
					if(location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
						var $target = $(this.hash);
						$target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');
						if($target.length) {
							var targetOffset = $target.offset().top;
							$('html,body').animate({
									scrollTop: targetOffset
								},
								1000);
							return false;
						}
					}
				});
			})

		}(jQuery));
	</script>

</html>